<template>
	<view class="cardpage">
		<view class="title">
			*请绑定本人银行卡，用于系统转账
		</view>
		<view class="line">
			<view class="label">
				开户行：
			</view>
				<input type="text" v-model="bank" placeholder="请输入开户行名称" />
		</view>
		<view class="line">
			<view class="label">
				卡号：
			</view>
				<input type="number"maxlength="19" v-model="cardnumber" placeholder="请输入卡号" />
		</view>
       <view class="line" style="margin-top: 20rpx;">
       	<view class="label">
       		持卡人：
       	</view>
		<input type="text" v-model="name" placeholder="请输入持卡人姓名" />
       </view>
	   <view class="line">
	   	<view class="label">
	   		电话：
	   	</view>
	   		<input type="number" maxlength="11" v-model="phone" placeholder="请输入电话"  />
	   </view>
	   <view class="line">
	   	<view class="label">
	   		身份证号：
	   	</view>
	   		<input type="number" v-model="idcard" placeholder="请输入身份证号" maxlength="18" />
	   </view>


	   <view class="btn" @click="save">
	   	   保存
	   </view>
	</view>
</template>

<script>
	 import {getBankCardInfo,bankCardInfo} from '../../utils/api.js'
	export default {
		data() {
			return {
				bank:'',
				cardnumber:'',
				name:'',
				phone:'',
				idcard:'',
				id:'',
				
			}
		},
		onShow() {
			let p={
				phone:uni.getStorageSync('phone')
				
			}
			getBankCardInfo(p).then(res=>{
				console.log(res)
				this.bank=res.data.data.doctorBankInfo
				this.cardnumber=res.data.data.doctorIdCard
				this.name=res.data.data.doctorName
				this.phone=res.data.data.doctorPhone
				this.idcard=res.data.data.doctorIdCard
				this.id=res.data.data.id
				
			})
		},
		methods: {
		  save(){
			  if(this.bank==''){
				  uni.showToast({
				  	title: '请输入开户行',
					icon:'none',
				  	duration: 2000
				  });
				  return
			  }
			  if(this.cardnumber==''){
			  				  uni.showToast({
			  				  	title: '请输入卡号',
			  					icon:'none',
			  				  	duration: 2000
			  				  });
			  				  return
			  }
			  if(this.name==''){
			  				  uni.showToast({
			  				  	title: '请输入持卡人',
			  					icon:'none',
			  				  	duration: 2000
			  				  });
			  				  return
			  }
			  if(this.phone==''){
			  				  uni.showToast({
			  				  	title: '请输入手机号',
			  					icon:'none',
			  				  	duration: 2000
			  				  });
			  				  return
			  }
			  if(this.idcard==''){
			  				  uni.showToast({
			  				  	title: '请输入身份证号',
			  					icon:'none',
			  				  	duration: 2000
			  				  });
			  				  return
			  }
			  let that=this
			  uni.showModal({
			  	title: '提示',
			  	content: '确定保存银行卡',
			  	success: function (res) {
			  		if (res.confirm) {
						let p={
							phone:uni.getStorageSync('phone'),
							doctorName:that.name,
							doctorPhone:that.phone,
							doctorIdCard:that.idcard,
							doctorBankCard:that.cardnumber,
							doctorBankInfo:that.bank,
							id:that.id
						}
						bankCardInfo(p).then(res=>{
							console.log(res)
							if(res.data.code==200){
								uni.showToast({
									title: '提交成功',
									duration: 2000
								});
								setTimeout(()=>{
									uni.navigateBack()
								},2000)

							}else{
								uni.showToast({
									title: res.data.msg,
									icon:'none',
									duration: 2000
								});
							}
						})
			  			
			  		} else if (res.cancel) {
			  			console.log('用户点击取消');
			  		}
			  	}
			  });

		  },
		}
	}
</script>

<style lang="less" scoped>
.cardpage{
	width: 750rpx;
	box-sizing: border-box;
	padding: 20rpx;
	background-color: whitesmoke;
	.title{
		width: 100%;
		box-sizing: border-box;
		padding: 20rpx;
	}
	.line{
		width: 100%;
		margin: auto;
		display: flex;
		align-items: center;
		height: 90rpx;
		line-height: 90rpx;
		text-align: center;
		background-color: white;
		border-bottom: 1rpx solid whitesmoke;
		
		.label{
			width: 35%;
			height: 70rpx;
			line-height: 70rpx;
			font-size: 28rpx;
			text-align: left;
			padding-left: 20rpx;
			
		}
		input{
			width: 75%;
			background-color: white;
			height: 70rpx;
			line-height: 70rpx;
			text-align: left;
			font-size: 30rpx;
		}
	}
	.btn{
		width: 70%;
		height: 70rpx;
		line-height: 70rpx;
		color: white;
		background-color: #1a4f8a;
		text-align: center;
		margin: auto;
		border-radius: 10rpx;
		margin-top: 50rpx;
	}
	
}
</style>
